import { useEffect, useRef, useState } from "react";

// 所有hooks函数都是以use开头

function App() {
    const [val, setVal] = useState("我是受控的");
    const inputRef = useRef(null);
    useEffect(() => {
        inputRef.current.value = "我是不受控的";
    }, []);
    return (
        <div>
            <p>input中的值：{val}</p>
            <input
                type="text"
                value={val}
                onChange={(e) => {
                    setVal(e.target.value);
                }}
            />
            <br />
            <hr />
            <input type="text" ref={inputRef} />
            <button
                onClick={() => {
                    inputRef.current.value = Math.random();
                }}>
                改变input的值
            </button>
        </div>
    );
}

export default App;
